<template>
  <div class="out-box">
    <div class="content-ab" v-if="screenWidth > 1024">
      <scrollHandle>
        <div></div>
      </scrollHandle>
      <scrollHandle>
        <div class="txt-c">
          通过落地性的品牌策略<br>
          创造实际的商业价值
        </div>
      </scrollHandle>
    </div>
    <!-- <div class="content-ab-mobel" v-if="screenWidth <= 1024">
      <scrollHandle>
        <el-carousel height="80rem" autoplay :pause-on-hover="false" :interval="8000">
          <el-carousel-item v-for="(item, index) in brandData" :key="index">
            <el-image class="imgstyle-mobel" :src="baseApi + item.imgUrl" fit="cover" />
          </el-carousel-item>
        </el-carousel>
      </scrollHandle>
      <scrollHandle>
        <div class="txt-c-mobel">
          通过落地性的品牌策略<br>
          创造实际的商业价值
        </div>
      </scrollHandle>
    </div> -->

  </div>
</template>

<script>
import { picConfigList } from "@/api/defapi";
import scrollHandle from "@/components/scrollHandle.vue";
export default {
  components: {
    scrollHandle,
  },
  data() {
    return {
      screenWidth: window.innerWidth,
      bannerImgList: '',
      baseApi: process.env.VUE_APP_IMGADDRESS,
      brandData: ''
    };
  },
  mounted() {
    window.addEventListener("resize", this.getScreenSise);
    picConfigList({ imgType: 3 }).then(res => {
      this.brandData = res.data
    })
  },
  methods: {
    getScreenSise() {
      this.screenWidth = window.innerWidth;
    },

  },
};
</script>

<style lang="scss" scoped>
.out-box {
  background-color: #fff;
  width: 100%;
}

.content-ab {
  padding: 0 100px;
  width: 100%;
  max-width: 1920px;
  margin: 0 auto;
}


.content-ab-mobel {
  background-color: #fff;
  padding: 0 3.2rem;
  width: 100%;
}

.txt-c {
  font-family: "BebasFontB";
  padding: 200px 0 300px;
  font-size: 70px;
}
.txt-c-mobel{
  font-family: "BebasFontB";
  padding: 18rem 0 25rem;
  font-size: 5rem;
}
.img-list-mobel {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr;
  grid-gap: 5.6rem;
}

.all-txt {
  font-family: "BebasFontB";
  font-size: 44px;
  padding-bottom: 42px;
}

.all-txt-mobel {
  font-family: "BebasFontB";
  font-size: 3.8rem;
  padding-bottom: 4rem;
}

.imgstyle {
  width: 100%;
  height: 1000px;
}
.imgstyle-mobel {
  width: 100%;
  height: 80rem;
}

::v-deep .el-carousel__indicators {
  display: none;
}

::v-deep .el-carousel__arrow {
  display: none;
}
</style>